<template>
  <view>
    <view style="width: 100%; border-bottom: 0 none; position: fixed; z-index: 2">
        <view style="background: #ffffff; position: relative">
          <view class="h-tab vp-flex">
            <view :class="'h-tab-item vp-flex_1 ' + (filt == '' ? 'on' : '')" data-filt=""
                  @tap="onFilterChange">全部</view>
            <view :class="'h-tab-item vp-flex_1 ' + (filt == 1 ? 'on' : '')" data-filt="1"
                  @tap="onFilterChange">开始筹备</view>
            <view :class="'h-tab-item vp-flex_1 ' + (filt == 2 ? 'on' : '')" data-filt="2"
                  @tap="onFilterChange">待服务</view>
            <view :class="'h-tab-item vp-flex_1 ' + (filt == 3 ? 'on' : '')" data-filt="3"
                  @tap="onFilterChange">已完成</view>
            <view :class="'h-tab-item vp-flex_1 ' + (filt == 4 ? 'on' : '')" data-filt="4"
                  @tap="onFilterChange">已取消</view>
          </view>
        </view>
      </view>
  </view>
</template>


<script setup>
	import { ref } from "vue";

  //记录当前的tab
  const filt = ref('')

  import {onShow} from '@dcloudio/uni-app'

	const current=ref(0);

  onShow(()=>{
    filt.value =''
  //  loadList()
  })

  //订单状态筛选
  const onFilterChange = (e) =>{
    const {filt:curFilt} = e.currentTarget.dataset
    if(curFilt === filt.value) return
    filt.value = curFilt
    //订单列表加载
    //loadList()
  }


  function clickBannerItem(item) {
	  console.info(item)
	};
	function changeSwiper(e) {
	  current.value = e.detail.current
	}
	function changeGrid(e) {
	  uni.showToast({
	    title: '模块建设中',
	    mask: false,
		icon:'loading',
	    duration: 1000
	  });
	}
</script>

<style>
@import './index.css';
@import '../../app.css';
</style>


